<!DOCTYPE html>
<html class="am-touch js cssanimations">
<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <title>手机绑定</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
    <meta name="renderer" content="webkit" />
    <link rel="icon" type="image/png" href="../assets/i/favicon.png" />
    <link rel="stylesheet" href="../assets/css/amazeui.min.css" />
    <link rel="stylesheet" href="../assets/css/app2.css" />
    <link rel="stylesheet" href="../assets/css/login.css" />
</head>
<body style="background-color: #f7f9f9;">
<div class="common-wrapper">
    <div class="main">
        <div class="item item-title">
            <h3>为防止用户信息被盗用，请使用本机号码登录   </h3>
        </div>

        <!-- 输入手机号码 -->
        <div class="item item-phone">
            <input id="mobile" name="mobile" class="txt-input txt-phone" type="tel" placeholder="请输入您的手机号" maxlength="11" autofocus="" required="">
        </div>

        <!-- 输入验证码 -->
        <div class="item item-captcha">
            <div class="input-info">
                <input id="validateCode" class="txt-input txt-captcha" type="text" size="11" maxlength="20" autocomplete="off" placeholder="输入验证码">
                <span id="captcha-img">获取验证码</span>
            </div>
        </div>

        <!-- 按钮 -->
        <div class="item item-btns">
            <a class="btn-next btn-disabled" href="#">绑定</a>
        </div>

        <div class="item">
            <div class="err-tips">
                <a href="#" id="kuai-ok">
                    <i class="r-btn"></i>
                    同意并接受快快车生活的<span>服务协议</span>
                </a>
            </div>
        </div>
    </div>
</div>
<script src="../assets/js/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
    $(function () {
        //  验证码
        $('#kuai-ok').on('click', function () {
            var self = $(this);
            var icon = $(self).find('.r-btn');
            if($(icon).hasClass('right')) {
                $(icon).removeClass('right');
                return false;
            } else {
                $(icon).addClass('right');
                return false;
            }
        });
    });
</script>
</body>
</html>